<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>箭头函数</title>
  <script type="text/javascript">
    // (参数列表) => {函数体}
    // 箭头函数无参数/多个参数,()不能省略   若只有一个参数,()可以省略
    // 箭头函数的函数体有多行语句,需用{}包裹,表示代码块    若只有一行语句并需返回结果,{}和return可以省略
    // 箭头函数多用于匿名函数定义
    let f1 = function (num) {
      return num * 2;
    }
    let f2 = (num) => {
      return num * 3;
    }
    let f3 = num => num * 4;
    console.log("传统f1:", f1(10));
    console.log("箭头函数f2:", f2(10));
    console.log("简化箭头函数f2:", f3(10));
    // 函数可作为参数(匿名函数)
    let f5 = (f) => {
      console.log(f(10));
    }
    f5(n => n * 5);
    // 多参函数
    let func1 = function (n, m) {
      let ret = 0;
      for (let i = n; i < m; i++) {
        ret += i;
      }
      return ret;
    }
    let func2 = (n, m) => {
      let ret = 0;
      for (let i = n; i < m; i++) {
        ret += i;
      }
      return ret;
    }
    console.log("传统多参func1:", func1(1,5));
    console.log("箭头函数多参func2:", func2(1,5));
    // 解构对象
    let person = {name: "tom", age: 18};
    let f = ({name}) => {
      console.log("对象的name:", name);
    }
    f(person);

  </script>
</head>
<body>
</body>
</html>
